<template>
	<div id="home">
		<Carouse></Carouse>
		<Icon :name="name" :ClassicsFrench="ClassicsFrench" :French="French" ></Icon>
		<!-- 这个标签是用来做跳转的 用来跳转其他组员的路由-->
		<router-link to="/goodscontent?">
			<div id="img">
				<img :src="$store.state.url+'/img/lfximg/1.jpg'">
				<!-- "$store.state.url+'/img/lfximg/1.jpg'" -->
			</div>
		</router-link>
		<Cake :ar="arr"></Cake>
		<Icon :name="name1" :ClassicsFrench="childrenSeries" :French="children"></Icon>
		<Cake :ar="arr1"></Cake>
		<router-link to="/zone">
			<div id="img">
				<img :src="$store.state.url+'/img/lfximg/4.jpg'">
				<!-- "$store.state.url+'/img/lfximg/4.jpg'" -->
			</div>
		</router-link>
		<Zone></Zone>
	</div>
</template>
<script>
	import Carouse from './Carouse.vue'
	import Icon from './Icon.vue'
	import Cake from './Cake.vue'
	import Zone from './Zone.vue'
	// import Bottom from './Bottom.vue'
	export default {
		components:{
			Carouse,
			Icon,
			Cake,
			Zone,
		},
		data(){
			return {
				name: "法式经典",
				ClassicsFrench: "ClassicsFrench",
				French: "French",
				name1: "儿童经典",
				childrenSeries: "childrenSeries",
				children: "Children",
				arr:"",
				arr1:""
			}
		},		
		async mounted() {
			 this.$store.commit('changeTypeNmame', 'home') 
			 let res= await this.axios.get("/lfx/test")
			 this.arr=res.data.ansor;
			 this.arr1=res.data.ansor1
		},	
	}
</script>

<style scoped="scoped">
	#goodscontent {
		width: 100%;
		display: block;
	}

	img {
		width: 100%;
		height: 470px;
		margin-bottom: 60px;
		margin-top: 60px;
	}

	#home {
		/* position: absolute;
		z-index: -111; */
		margin-top: 120px;
	}
</style>
